<template>
	<u-table>
		<u-tr v-if="needSum" class="u-tr">
			<u-th class="u-th">数量汇总</u-th>
			<u-th class="u-th">{{ listLength }}</u-th>
		</u-tr>
		<u-tr class="u-tr">
			<u-th class="u-th" v-for="(item, index) in col" :key="index">
				<view>
					{{ item.label }}
					<u-icon v-if="item.needSort" :name="sort[item.key] ? 'arrow-up-fill' : 'arrow-down-fill'" color="#82848a" size="20" @click="sortBy(item.key)"></u-icon>
				</view>
			</u-th>
		</u-tr>
		
		<u-tr class="u-tr" v-for="item in list" :key="item.id">
			<u-td :class="['u-td', col.length > 4 ? 'tableItem' : 'tableItem4']" v-for="(colItem, index) in col" :key="index">
				<template v-if="colItem.isDate">
					<text :style="{ color: dateColorFormatter(item[colItem.key]) }">{{ formatProductDate(item[colItem.key]) }}</text>
				</template>
				<template v-else>
					<text>{{ colItem.needFilter ? filterFn(item, colItem) : item[colItem.key] }}</text>
				</template>
			</u-td>
		</u-tr>
		
	</u-table>
</template>

<script>
import queryMixin from '../../mixin/queryMixin.js';
import { _outStorageTypeDict } from '@/utils/dict.js';
export default {
	mixins: [queryMixin],
	props: {
		col: {
			type: Array,
			default: () => []
		},
		list: {
			type: Array,
			default: () => []
		},
		needSum: {
			type: Boolean,
			default: false
		}
	},
	methods: {
		filterFn(item, col) {
			switch (col.key) {
				case 'outType': {
					let value = item;
					if (value) {
						if (value.xsZt) {
							return '销售出库';
						} else {
							return _outStorageTypeDict[value.outType];
						}
					} else {
						return '';
					}
					break;
				}
				default: {
					return '';
				}
			}
		}
	}
};
</script>

<style></style>
